<!--
 * @Author: GKN
 * @Date: 2023-07-18 09:20:07
 * @LastEditTime: 2024-02-01 15:13:24
 * @LastEditors: GKN
 * @Description: 
 * @FilePath: \mod\src\view\home\indexHome.vue
 * 可以输入预定的版权声明、个性签名、空行等
-->
<template>
  <div class="main mainPadding" v-loading="loading">
    <div class="max-w">
    <div class="m1 MarT">
        <el-row :gutter="20">
            <el-col :span="16">
                <Card1 title="政策快讯" :more="false">
                    <template v-slot:img>
                      <img src="@/assets/img/icon1.png" class="title-icon" alt="">
                    </template>
                      <template v-slot:main>
                        <div style="height: 46px;width: 100%;overflow: hidden;">
                          <div class="zckx">
                            <vue3-seamless-scroll style="width: 100%;height: 46px;" :list="list1" :step="0.5" direction="left" class="" :hover="true">
                              <div class="zckx">
                                <div class="ul-item">
                                    <div class="li-item" v-for="(item, index) in list1" :key="index" @click="goInfo(item,'政策快讯')">
                                        {{ item.name }}
                                    </div>
                                </div>
                              </div>
                            </vue3-seamless-scroll>
                          </div>
                        </div>
                      </template>
                </Card1>
            </el-col>
            <el-col :span="8">
                <Card1 title="重要通知" :more="false">
                    <template v-slot:img>
                        <img class="title-icon" src="@/assets/img/icon2.png" alt="">
                    </template>
                    <template v-slot:main>
                      <div style="height: 46px;width: 100%;overflow: hidden;">
                        <div class="zytz">
                            <img src="@/assets/img/icon3.png" alt="">
                            <div style="width: 80%;">
                              <el-carousel height="46px" direction="vertical" :autoplay="true">
                                <el-carousel-item v-for="item in list2" :key="item">
                                  <div @click="goInfo(item,'重要通知')" class="font-content-14 omit cursor-p" style="line-height:46px;">{{ item.name }}</div>
                                </el-carousel-item>
                              </el-carousel>
                            </div>
                        </div>
                      </div>
                      <div>
                        
                      </div>
                    </template>
                </Card1>
            </el-col>
        </el-row>
    </div>
    <div class="m2 MarT shadow-2">
        <div class="title cursor-p" style="text-align: center;" @click="goInfo(topt[0],'推荐')">
          <el-skeleton :rows="0" style="width:100%;height: 30px;" v-if="topt.lenth==0" >
            <template #template>
                <div
                  style="width:100%;display: flex;align-items: center;justify-content: space-between;
                  "
                >
                <el-skeleton-item style="width: 100%;height: 30px;" />
              </div>
              </template>
            </el-skeleton>
          {{ topt.length>0?topt[0].name:''}}
        </div>
        <div class="m2main">
          <el-skeleton style="width: 100%" animated :rows="0" v-if="topt.length==0">
            <template #template>
              <div
                style="width:100%;display: flex;align-items: center;justify-content: space-between;
                "
              >
                <el-skeleton-item style="width: 20%;height: 30px;" />
                <el-skeleton-item style="width: 20%;height: 30px;" />
                <el-skeleton-item style="width: 20%;height: 30px;" />
                <el-skeleton-item style="width: 20%;height: 30px;" />
              </div>
            </template>
            
          </el-skeleton>
          <div style="width:100%;">
            <el-row :gutter="25">
                <el-col :span="6"  >
                  <div class="m2item cursor-p" @click="goInfo(topt.length>1?topt[1]:'','推荐')">{{ topt.length>1?topt[1].name:'' }}</div>
                </el-col>
                <el-col :span="6" >
                  <div class="m2item cursor-p" @click="goInfo(topt.length>2?topt[2]:'','推荐')">{{ topt.length>2?topt[2].name:'' }}</div>
                </el-col>
                <el-col :span="6" >
                  <div class="m2item cursor-p" @click="goInfo(topt.length>3?topt[3]:'','推荐')">{{ topt.length>3?topt[3].name:'' }}</div>
                </el-col>
                <el-col :span="6">
                  <div class="m2item cursor-p" @click="goInfo(topt.length>4?topt[4]:'','推荐')">{{ topt.length>4?topt[4].name:'' }}</div>
                </el-col>
            </el-row>
          </div>
        </div>
    </div>
    <div class="m3 MarT back-fff" style="height:680px;">
        <el-carousel @change="carouselChange" width="100%" height="680px" direction="horizontal" indicator-position="none" :interval="3500">
            <el-carousel-item v-for="item in banner_list" :key="item" @click="goInfo(item,'轮播')" style="position:reactive;">
              <imgView :src="item.thumb"  />
              <div class="po-ab0 xf-font" style="width: 100%;text-align: left;">
                    {{item.name }}
              </div>
            </el-carousel-item>
        </el-carousel>
        <div class="indicationPoint">
            <div v-for="(item,i) in banner_list" :key="i" :class="bannerIndex == i?'item1':'item2'"></div>
        </div>
    </div>
    <div class="m4 MarT">
        <el-row :gutter="20">
            <el-col :span="16">
              <el-row class="cardRow" :gutter="20">
                <el-col v-for="item in video_list" :key="item" :span="8">
                  <Card2 class="card" type="video" :url="item.thumb" :title="item.name" :desc="item.blurb" @click="goInfo(item,'首页视频')"></Card2>
                </el-col>
              </el-row>
              <el-row class="cardRow MarT" :gutter="20">
                <el-col v-for="item in article_list" :key="item" :span="8">
                  <Card2 class="card" type="img" :url="item.thumb" :title="item.name" :desc="item.blurb" @click="goInfo(item,'首页文章')"></Card2>
                </el-col>
              </el-row>
            </el-col>
            <el-col :span="8" style="height: 456px;">
              <div class="listView1 " v-if="loading_top" >
                <el-skeleton animated style="width:100%;height: 100%;">
                    <template #template>
                      <div class="flex-d flex-j-s h-Full p-t p-b">
                        <el-skeleton-item variant="p" style="width: 100%;height: 46px;" />
                        <el-skeleton-item variant="p" style="width: 100%;height: 46px;" />
                        <el-skeleton-item variant="p" style="width: 100%;height: 46px;" />
                        <el-skeleton-item variant="p" style="width: 100%;height: 46px;" />
                      </div>
                    </template>
                </el-skeleton>
              </div>
              <div class="listView1" v-if="!loading_top" >
                <div class="item cursor-p" v-for="item in hot_list" :key="item" @click="goInfo(item,'热文排行')">
                  <img src="@/assets/img/icon4.png" alt="">
                  <div class="cont">
                    <p class="omit-3">{{ item.name }}</p>
                    <!-- <p class="omit"></p> -->
                  </div>
                </div>
              </div>
              <div class="adview2 ">
                <div class="adImg " >
                  <adImgView :src="ad_list3.length>0?ad_list3[0].img:''" @click="govillage(ad_list3.length>0?ad_list3[0]:'')" />
                </div>
              </div>
            </el-col>
        </el-row>
    </div>
    <div class="m5 MarT">
        <el-row :gutter="20">
            <el-col :span="8">
              <Card3 :title="list_children?list_children[5].name:''" :list="list4" :isAnimation="true" @moreClick="more(list_children[5].id,list_children[5]?list_children[5].name:'')">
                <template v-slot:logoView>
                    <img src="@/assets/img/icon5.png" alt="">
                </template>
              </Card3>
            </el-col>
            <el-col :span="8">
              <Card3 :title="list_children?list_children[6].name:''" :list="list5" :isAnimation="true" @moreClick="more(list_children[6].id,list_children[6]?list_children[6].name:'')">
                <template v-slot:logoView>
                    <img src="@/assets/img/icon6.png" alt="">
                </template>
              </Card3>
            </el-col>
            <el-col :span="8">
              <Card3 :title="list_children?list_children[7].name:''" :list="list6" :isAnimation="true" @moreClick="more(list_children[7].id,list_children[7]?list_children[7].name:'')">
                <template v-slot:logoView>
                    <img src="@/assets/img/icon7.png" alt="">
                </template>
              </Card3>
            </el-col>
        </el-row>
    </div>
    <!-- 广告 -->
    <div class="m6 MarT back-fff" >
      <adImgView :src="ad_list4.length>0?ad_list4[0].img:''" @click="proxy.$comJs.openUrl(ad_list4.length>0?ad_list4[0]:'')" />
    </div>
    <!-- 高汤克伦 -->
    <div class="m7 MarT">
      <el-row :gutter="20">
          <el-col :span="16">
            <Card1 :title="list_children?list_children[8].name:''" :more="true" @moreClick="more(list_children[8].id,list_children[8]?list_children[8].name:'')">
              <template v-slot:img>
                  <img class="title-icon" src="@/assets/img/icon9.png" alt="">
              </template>
              <template v-slot:main1>
                <div style="height: 265px;"> 
                  <myEmpty description="" v-if="!GTist||GTist.length==0" />
                  <el-carousel v-if="GTist.length>0" @change="carouselChange2" width="100%" height="236px" type="card" indicator-position="none" interval="3500">
                    <el-carousel-item v-for="item in GTist" :key="item" @click="goInfo(item,list_children?list_children[8].name:'')">
                      <div class="shadow-3" style="height:100%;">
                        <imgView :src="item.thumb" />
                      </div>
                    </el-carousel-item>
                  </el-carousel>
                </div>
                <div class="adTitleView">
                  <div class="title" style="text-align:center;">{{ GTist.length>0?GTist[bannerIndex2].name:'' }}</div>
                  <div class="desc omit" style="text-align:center;">{{ GTist.length>0?GTist[bannerIndex2].blurb:'' }}</div>
                </div>
              </template>
            </Card1>
            <Card1 :title="list_children?list_children[10].name:''" :more="true" @moreClick="more(list_children[10].id,list_children[10]?list_children[10].name:'')" style="margin-top:20px;">
              <template v-slot:img>
                  <img class="title-icon" src="@/assets/img/icon91.png" alt="">
              </template>
              <template v-slot:main1>
                <div style="height: 260px;">
                  <myEmpty description="" v-if="!LXList||LXList.length==0" />
                  <el-row :gutter="20">
                  <el-col :span="8" v-for="(item,i) in LXList" :key="i"  @click="goInfo(item,list_children?list_children[10].name:'')">
                    <Card4 class="card" :url="item.thumb" :title="item.name" :desc="item.blurb"></Card4>
                  </el-col>
                </el-row>
                </div>
                
              </template>
            </Card1>
          </el-col>
          <el-col :span="8" >
            <Card1 :title="list_children?list_children[9].name:''" :more="false"  style="height: 100%;background: #fff;">
              <template v-slot:img>
                  <img class="title-icon" src="@/assets/img/icon8.png" alt="">
              </template>
              <template v-slot:main1>
                <div style="height: 642px;">
                  <myEmpty description="" v-if="!CXList||CXList.length==0" />
                  <Card5 v-for="(item,i) in CXList" :key="i" class="card" @click="goInfo(item,list_children?list_children[9].name:'')" :url="item.thumb" :title="item.name" :desc="item.blurb" style="margin-bottom:10px;"></Card5>
                </div>
              </template>
            </Card1>
          </el-col>
      </el-row>
    </div>
    <div class="m8 MarT" id="m8">
      <el-row :gutter="20" style="height: 100%;">
          <el-col :span="16" @click="proxy.$comJs.openUrl(ad_list5.length>0?ad_list5[0]:'')">
            <div class="shadow-1 border-r6 back-fff" style="height: 100%;">
              <adImgView :src="ad_list5.length>0?ad_list5[0].img:''" />
            </div>
          </el-col>
          <el-col :span="8" @click="proxy.$comJs.openUrl(ad_list1.length>0?ad_list1[0]:'')">
            <div class="shadow-2 border-r6 back-fff" style="height: 100%;">
              <adImgView :src="ad_list1.length>0?ad_list1[0].img:''" />
            </div>
          </el-col>
      </el-row>
    </div>
    <!-- 团体标准 -->
    <div class="m9 MarT">
      <el-row style="height: 100%;" :gutter="20">
          <el-col :span="8" style="height: 100%;">
            <Card3 :title="list_children?list_children[11].name:''" :list="list7" @moreClick="more(list_children[11].id,list_children[11]?list_children[11].name:'')" :isAnimation="false" style="height: 100%;">
              <template v-slot:logoView>
                  <img src="@/assets/img/icon93.png" alt="">
              </template>
            </Card3>
          </el-col>
          <el-col :span="8" style="height: 100%;">
            <Card3 :title="list_children?list_children[12].name:''" :list="list8" @moreClick="more(list_children[12].id,list_children[12]?list_children[12].name:'')" :isAnimation="false" style="height: 100%;">
              <template v-slot:logoView>
                  <img src="@/assets/img/icon92.png" alt="">
              </template>
            </Card3>
          </el-col>
          <el-col :span="8" style="height: 100%;">
            <div class="imgs ">
              <div class="imgItem back-fff">
                <adImgView :src="ad_list1.length>1?ad_list1[1].img:''" @click="proxy.$comJs.openUrl(ad_list1.length>1?ad_list1[1]:'')" />
              </div>
              <div class="imgItem back-fff">
                <adImgView :src="ad_list1.length>2?ad_list1[2].img:''" @click="proxy.$comJs.openUrl(ad_list1.length>2?ad_list1[2]:'')"  />
              </div>
            </div>
          </el-col>
      </el-row>
    </div>
    <div class="adheight m11 MarT back-fff ">
        <adImgView :src="ad_list2.length>0?ad_list2[0].img:''" @click="proxy.$comJs.openUrl(ad_list2.length>0?ad_list2[0]:'')"  />
    </div>
    <div class="m10 MarT">
      <Card1 :title="list_children?list_children[13].name:''" :more="true" @moreClick="more(list_children[13].id,list_children[13]?list_children[13].name:'')">
          <template v-slot:img>
              <img class="title-icon" src="@/assets/img/icon94.png" alt="">
          </template>
            <template v-slot:main1>
              <div style="width: 100%;overflow: hidden;">
                <div class="m10box">
                  <myEmpty description="" v-if="!tbList||tbList.length==0" />
                  <vue3-seamless-scroll ref="scroll3" style="width: 100%;height: 46px;" :step="1" limitScrollNum="5" :list="tbList" direction="left" class="" :hover="true">
                    <div class="m10box">
                      <div class="ul">
                          <div class="li" v-for="(item, index) in tbList" :key="index" @click="goInfo(item,list_children?list_children[13].name:'')">
                              <div class="img">
                                <imgView :src="item.thumb" />
                              </div>
                              <div class="title omit">{{ item.name }}</div>
                          </div>
                      </div>
                    </div>
                  </vue3-seamless-scroll>
                </div>
              </div>
            </template>
          
      </Card1>
    </div>
    <div class="m12 MarT border-r6 shadow-1">
      <TitleView title="经典案例"></TitleView>
      <myEmpty description="" v-if="!JDList||JDList.length==0" />
      <Card6 v-for="(item,i) in JDList" :key="i" :url="item.thumb" :title="item.name" :desc="item.blurb" :i="i" :isBorder="(i+1)==JDList.length?false:true" @click="goInfo(item,'经典案例')"></Card6>
      <el-row :gutter="20" style="height: 100%;margin-top:20px;">
          <el-col :span="16">
            <div class="goodsL" style="height:100%;">
              <div class="goodsLs">
                <div class="item" v-for="item in JDList1" :key="item" @click="goInfo(item,'经典案例')">
                  <img src="@/assets/img/tz.png" alt="">
                  <div class="omit cursor-p">{{ item.name }}</div>
                </div>
              </div>
              <div class="more" v-if="JDList1.length>11" @click="more_other(7,'经典案例')">查看更多</div>
            </div>
            
          </el-col>
          <el-col :span="8">
            <adImgView :src="ad_list7.length>0?ad_list7[0].img:''" @click="proxy.$comJs.openUrl(ad_list7[0])" />
            <!-- <goodsList v-if="bookList.length" :title="bookList[0].title" :id="bookList[0].bookId" :price="bookList[0].price" :url="bookList[0].cover"></goodsList> -->
          </el-col>
      </el-row>
    </div>
    <div class="m13 MarT" @click="goCloud()">
      <adImgView :src="ad_list6.length>0?ad_list6[0].img:''" @click="proxy.$comJs.openUrl(ad_list6[0])" />
        <!-- <img class="ad-img" src="~@/assets/img/ad7.png" alt=""> -->
    </div>
    <div class="m14 MarT">
      <div class="logo"><img src="@/assets/img/zw1.png" alt=""></div>
      <div class="cont">
        <div class="contbox" >
          <vue3-seamless-scroll style="width: 100%;height:80px;" :list="ppdhlist" :step="0.5" direction="left" class="" :hover="true">
              <div class="mul">
                  <div class="mli" v-for="(item, index) in ppdhlist" :key="index" @click="proxy.$comJs.openUrl(item)">
                    <div class="border-r6 shadow-4" style="width:80px;height: 80px;"><imgView :src="item.icon" type="logo" /></div>
                  </div>
              </div>
          </vue3-seamless-scroll>
        </div>
      </div>
    </div>
    <div class="m15 MarT">
      <TitleView title="友情链接"></TitleView>
      <div class="cont">
        <myEmpty description="" v-if="!yqljlist||yqljlist.length==0" />
        <div v-for="item in yqljlist" :key="item" class="item cursor-p" @click="proxy.$comJs.openUrl(item)">{{ item.title }}</div>
      </div>
    </div>
    </div>
  </div>
  
  <div class="adL adWH" v-if="isleft">
    <AD1 direction="left" type="r" :url="ad.lurl.img" @close="close('left')" @click.stop="proxy.$comJs.openUrl(ad.lurl)" />

  </div>
  <div class="adR adWH" v-if="isright">
    <AD1 direction="right" type="r" :url="ad.rurl.img" @close="close('right')" @click.stop="proxy.$comJs.openUrl(ad.rurl)" />
    </div>
</template>
<script setup>
import { ref,reactive, onMounted,getCurrentInstance } from "vue";
const { proxy } = getCurrentInstance();
import CryptoJS from 'crypto-js';
import { useRouter } from "vue-router";
const Router = useRouter();
import Card1 from '../components/card1.vue';
import Card2 from '../components/card2.vue';
import Card3 from '../components/card3.vue';
import Card4 from '../components/card4.vue';
import Card5 from '../components/card5.vue';
import Card6 from '../components/card6.vue';
import TitleView from '../components/title.vue';
import goodsList from '../components/goodsList1.vue';
import AD1 from '../components/ad.vue'
import AD2 from '../components/ad.vue'
import { Vue3SeamlessScroll } from "vue3-seamless-scroll";
import { useStore } from 'vuex';
const store = new useStore();
  // 导航下对应模块
  const list_children = ref(store.state.tabs?store.state.tabs[0].children:JSON.parse(localStorage.getItem( 'headerTabs' ))[0].children)
  // 国企广告
  const ad_list1 = ref([])
  // 国资广告
  const ad_list2 = ref([])
  // 纪事
  const ad_list3 = ref([])
  // 高谈客论
  const ad_list4 = ref([])
  // 企业领袖
  const ad_list5 = ref([])
  // 经典案例
  const ad_list6 = ref([])
  const ad_list7 = ref([])
  
  // 广告
  const ad = ref({
    rurl:'',
    lurl:''
  })
  const getAd=(id)=>{
    proxy.$comJs.getAd(id,0,function(res){
      var list1 = [],list2=[],list3=[],list4=[],list5=[],list6=[],list7=[]
      console.log(res.list)
        res.list.map((item)=>{
          if(item.nid == 166){
            list1.push(item)
          }
          if(item.nid == 147){
            list2.push(item)
          }
          if(item.nid == 17){
            list3.push(item)
          }
          if(item.nid == 160){
            list4.push(item)
          }
          if(item.nid == 146){
            list5.push(item)
          }
          if(item.nid == 169){
            if(item.location == 1){
              list6[0] = item
            }
            if(item.location == 4){
              list7[0] = item
            }
            
          }
          
        })
        ad_list1.value = list1.length>0?list1:[]
        ad_list2.value = list2.length>0?list2:[]
        ad_list3.value = list3.length>0?list3:[]
        ad_list4.value = list4.length>0?list4:[]
        ad_list5.value = list5.length>0?list5:[]
        ad_list6.value = list6.length>0?list6:[]
        ad_list7.value = list7.length>0?list7:[]

    })
  }
  const isleft = ref(true)
  const isright = ref(true)
  const close=(type)=>{
      if(type == 'left'){
        isleft.value = false
      }
      if(type == 'right'){
        isright.value = false
      }
  }
  getAd(store.state.tabs?store.state.tabs[0].id:JSON.parse(localStorage.getItem( 'headerTabs' ))[0].id)

  const getAdzr=()=>{
    proxy.$http.request(proxy.$api.list_advert+'?nid=0','get',{},false, function (res) {
      if(res&&res.data){
        res.data.data.list.map((item)=>{
          if(item.location == 3){
            ad.value.lurl = item
          }
          if(item.location == 4){
            ad.value.rurl = item
          }
        })
        
      }
    })
  }
  getAdzr()
  // 最新最热文章
  const loading_top = ref(true)
  const rec_list = ref([])
  const hot_list = ref([])
  // 政策快讯
  const list1=ref([])
  // 重要通知
  const list2=ref([])
  const bookList=ref([])
  const getHot=()=>{
      proxy.$http.request(proxy.$api.news_rec,'get',{},false, function (res) {
          if(res&&res.data){
            rec_list.value = res.data.data.rec?res.data.data.rec:[]
            hot_list.value = res.data.data.hot?res.data.data.hot:[]
            list1.value = res.data.data.unit?res.data.data.unit:[]
            // 轮播图处理
            if(res.data.data.notice.length>0){
              if(res.data.data.notice.length==2){
                var llist = []
                llist = res.data.data.notice
                llist.push({...res.data.data.notice[0]})
                llist.push({...res.data.data.notice[1]})
                list2.value = llist
              }else{
                list2.value = res.data.data.notice?res.data.data.notice:[]
              }
            }else{
              list2.value = []
            }
            bookList.value = res.data.data.book?res.data.data.book:[]
            setTimeout(()=>{
              loading_top.value = false
            },800)
            
          }
      })
  }
  getHot()
  // 头条
    const topt=ref([])
    // 轮播
    const banner_list = ref(null)
    // 视频
    const video_list = ref(null)
    // 首页文章
    const article_list = ref(null)
    // 纪实列表
    const list4=ref([])
    // 即时
    const list5=ref([])
    // 纪事
    const list6=ref([])
    // 高谈阔论
    const GTist =ref([])
    // 企业领袖
    const LXList = ref([])
    const list7 = ref([])
    const list8 = ref([])
    // 创新人物
    const CXList = ref(null)
    // 特别推荐
    const tbList = ref([])
    // 页面数据获取
    const getPageList=()=>{
      list_children.value.map((item,i)=>{
        
        if(i==0){
          proxy.$comJs.getNewList(10,item.id,{nextTag:0,prevTag:0},'',(data)=>{
            banner_list.value = data.list
          })
        }
        if(i==1){
          proxy.$comJs.getNewList(3,item.id,{nextTag:0,prevTag:0},'',(data)=>{
            video_list.value = data.list
          })
        }
        if(i==2){
          proxy.$comJs.getNewList(3,item.id,{nextTag:0,prevTag:0},'',(data)=>{
            article_list.value = data.list
          })
        }
        if(i==5){
          proxy.$comJs.getNewList(5,item.id,{nextTag:0,prevTag:0},'',(data)=>{
            list4.value = data.list
          })
        }
        if(i==6){
          proxy.$comJs.getNewList(5,item.id,{nextTag:0,prevTag:0},'',(data)=>{
            list5.value = data.list
          })
        }
        if(i==7){
          proxy.$comJs.getNewList(5,item.id,{nextTag:0,prevTag:0},'',(data)=>{
            list6.value = data.list
          })
        }
        if(i==8){
          proxy.$comJs.getNewList(10,item.id,{nextTag:0,prevTag:0},'',(data)=>{
            GTist.value = data.list
          })
        }
        if(i==9){
          proxy.$comJs.getNewList(4,item.id,{nextTag:0,prevTag:0},'',(data)=>{
            CXList.value = data.list
          })
        }
        if(i==10){
          proxy.$comJs.getNewList(3,item.id,{nextTag:0,prevTag:0},'',(data)=>{
            LXList.value = data.list
          })
        }
        if(i==11){
          console.log(11111,item.id)
          proxy.$comJs.getNewList(10,item.id,{nextTag:0,prevTag:0},'',(data)=>{
            list7.value = data.list
            
          })
        }
        if(i==12){
          proxy.$comJs.getNewList(10,item.id,{nextTag:0,prevTag:0},'',(data)=>{
            list8.value = data.list
          })
        }
        if(i==13){
          proxy.$comJs.getNewList(10,item.id,{nextTag:0,prevTag:0},'',(data)=>{
            tbList.value = data.list
          })
        }
        if(i==14){
          proxy.$comJs.getNewList(5,item.id,{nextTag:0,prevTag:0},'',(data)=>{
            topt.value = data.list
          })
        }
      })
    }
    getPageList()
    // 专题图片列表
    const ZTList = []
    // 经典案例
    const JDList = ref([])
    const JDList1 = ref([])
    const getJDList=()=>{
      proxy.$http.request(proxy.$api.news_other+'?pageSize=15&sty=7','get',{},false, function (res) {
        if(res&&res.data){
            if(res.data.data.list!= undefined){
              res.data.data.list.map((item,i)=>{
                if(i<3){
                  JDList.value.push(item)
                }else{
                  JDList1.value.push(item)
                }
              })
            } 
        }
      })
    }
    getJDList()
    // 品牌导航
    // 友情链接
    const ppdhlist = ref([])
    const yqljlist = ref([])
    const get_p_y_list=()=>{
      proxy.$http.request(proxy.$api.home_link,'get',{},false, function (res) {
          if(res&&res.data){
            ppdhlist.value = res.data.data.brand?res.data.data.brand:[]
            yqljlist.value = res.data.data.link?res.data.data.link:[]
          }
      })
    }
    get_p_y_list()
    const goodsLlist = [1,1,1,1,1,1,1,1,1,1,1,1]
    // 商品
    const goods = {
      title:'商品名称商品名称商品名称商品名称商品名称商品名称',
      price:'12999',
      url:''
    }
    const bannerIndex = ref(0)
    const carouselChange = (e)=>{
      bannerIndex.value = e
    }
    const bannerIndex2 = ref(0)
    const carouselChange2 = (e)=>{
      bannerIndex2.value = e
    }
  const more =(id,title)=>{
    Router.push({
      path:'/animatedly/list',
      query:{
        ob:proxy.$comJs.encry({
          title:title,
          id:id,
          first_title:'首页',
        })
      }
    });
  }
  const more_other =(ty,title)=>{
    Router.push({
      path:'/animatedly/listOther',
      query:{
        ob:proxy.$comJs.encry({
          title:title,
          ty:ty,
          first_title:'首页',
        })
      }
    });
  }
  const goInfo=(item,name)=>{
    const routeUrl = Router.resolve({
        path:'/animatedly/info',
        query:{
            ob:proxy.$comJs.encry({
                title:name,
                id:item.newsId,
                path:'/animatedly/list',
                first_title:'首页',
                first_path:-1
            })
        }
    });
    window.open(routeUrl.href, "_blank");
    
  }
  const goInfo_s=(item)=>{
    const routeUrl = Router.resolve({
        path:'/animatedly/info',
        query:{
            ob:proxy.$comJs.encry({
                title:item.name,
                id:item.newsId,
                path:'/animatedly/list',
                first_title:'首页',
                first_path:-1
            })
        }
    });
    window.open(routeUrl.href, "_blank");
  }
  const goCloud=()=>{
    Router.push({name:'cloudHall'});
  }
  const goAch=()=>{
    localStorage.setItem( 'tabsStatus', 6 )
    store.state.headerIndex = 6
    const ob = CryptoJS.AES.encrypt(JSON.stringify('成果库'),'name').toString();
    Router.push({
      name:'ach',
      query:{
        ob:ob
      }
    })
  }
  const goSpecial=(item)=>{
    if(!item.url){
      return;
    }
    const ty = proxy.$comJs.queryParam(item.url,'ty')
    const id = proxy.$comJs.queryParam(item.url,'id')
    Router.push({
      name:'special',
      query:{
        ob:proxy.$comJs.encry(id)
      }
    })
  }
  const govillage=(item)=>{
    if(!item){
      return;
    }
    const ty = proxy.$comJs.queryParam(item.url,'ty')
    const id = proxy.$comJs.queryParam(item.url,'id')
    Router.push({
      name:'village',
      query:{
        ob:proxy.$comJs.encry(id)
      }
    })
  }
</script>
<style lang="less" scoped>
/deep/ .swiper-container{
  position: initial;
}
/deep/ .swiper-button-prev{
  width:36px;
  height: 36px;
  background: #f7f7f7;
  border-radius: 50%;
  left:-17px;
}
/deep/ .swiper-button-next{
  width:36px;
  height: 36px;
  background: #f7f7f7;
  border-radius: 50%;
  right:-17px;
}
/deep/ .swiper-button-prev:after{
  content:''
}
/deep/ .swiper-button-next:after{
  content:''
}
   .main{
      background: #F5F7F9;  
      width: 100%;
      box-sizing: border-box;
      .m1{
        width: 100%;
      }
      .m2{
        background: #fff;
        padding:38px 78px;
        box-sizing: border-box;
        .title{
            font-size: 40px;
            font-family: SourceHanSansCN-Medium, SourceHanSansCN;
            font-weight: 500;
            color: #D10B00;
            line-height: 50px;
            text-align: left;
        }
        .m2main{
            display: flex;
            margin-top:30px;
            .m2item{
                font-size: 16px;
                font-family: SourceHanSansCN-Medium, SourceHanSansCN;
                font-weight: 500;
                color: #797979;
                line-height: 24px;
                white-space: nowrap;
                overflow: hidden;
                text-overflow: ellipsis;
            }
        }
      }
      .m3{
        width: 100%;
        position: relative;
        .indicationPoint{
            display: flex;
            position: absolute;
            right:40px;
            bottom: 22px;
            z-index: 2;
            .item1{
                width: 40px;
                height: 8px;
                border-radius: 20px;
                background: rgba(209, 11, 0,1);
                margin-left: 16px;
            }
            .item2{
                width: 8px;
                height: 8px;
                border-radius: 50%;
                background: rgba(216, 214, 212,1);
                margin-left: 16px;
            }
        }
      }
      .m4{
        width: 100%;
        .adview2{
          width: 100%;
          height: 30%;
          padding-top:20px ;
          box-sizing: border-box;
          .adImg{
            width: 100%;
            height: 100%;
            background: #ececec;
            border-radius: 6px;
            overflow: hidden;
            img{
              width: 100%;
              height: 100%;
            }
          }
        }
        .listView1{
          background: #fff;
          width: 100%;
          height: 70%;
          padding: 0 20px;
          box-sizing: border-box;
          border-radius: 6px;
          .item{
            display: flex;
            align-items: center;
            border-bottom: 1px dotted #ebebeb;
            height: 25%;
            img{
              width:30px;
              height: 30px;
              margin-right: 6px;
            }
            .cont{
              width: 90%;
              background: #fff;
              text-align: left;
              p:first-child{
                color: #333;
                font-weight: bold;
              }
              p:last-child{
                color: #8d8d8d;
                margin-top:10px;
              }
            }
          }
        }
      }
      .m6{
        width: 100%;
        height: 200px;
        overflow: hidden;
        border-radius: 6px;
        img{
          width: 100%;
          height: 200px;
        }
      }
      .m7{
        width: 100%;
        .adTitleView{
          margin-top: 22px;
          .title{
            font-size: 18px;
            color: #333;
            font-weight: bold;
          }
          .desc{
            font-size: 14px;
            color: #8d8d8d;
            margin-top:14px;
          }
        }
      }
      .m8{
        width: 100%;
        height: 200px;
        overflow: hidden;
        .m8box{
          .m8ul{
            width: 100%;
            display: flex;
            height: 200px;
            .m8li{
            margin-right: 20px;
            height: 200px;
            overflow: hidden;
            cursor: pointer;
            border-radius: 6px;
            img{
              width:410px;
              height: 200px;
            }
          }
          }
          
        }
      }
      .m9{
        width: 100%;
        height: 466px;
        .imgs{
          display: flex;
          flex-direction: column;
          justify-content: space-between;
          height: 100%;
          .imgItem{
            width: 100%;
            height: 48%;
            background: #ececec;
            border-radius: 6px;
            overflow: hidden;
            img{
              width:100%;
              height: 100%;
              object-fit: cover;
            }
          }
        }
      }
      .m11{
        width:100%;
        border-radius: 6px;
        overflow: hidden;
        img{
          width:100%;
          height: 100%;
        }
      }
      .m10{
        .m10box{
          .ul{
            display: flex;
            .li{
              width: 240px;
              padding: 20px;
              border-radius: 6px;
              overflow: hidden;
              box-sizing: border-box;
              display: flex;
              flex-direction: column;
              align-items: center;
              .title{
                font-size: 16px;
                color: #333;
                text-align: center;
                margin-top: 18px;
                width: 100%;
              }
              .img{
                width: 200px;
                height: 200px;
                img{
                  width:100%;
                  height: 100%;
                  object-fit: cover;
                }
              }
            }
          }
        }
      }
      .m12{
        width:100%;
        background: #fff;
        padding: 20px 24px;
        box-sizing: border-box;
        .more{
          width:180px;
          height: 40px;
          color: #d10b00;
          background: #fff2f1;
          border:1px solid #d10b00;
          border-radius: 6px;
          line-height: 40px;
          margin: 0 auto;
          cursor: pointer;
          text-align:center;
        }
        .goodsL{
          border-right:1px dashed#d6d6d6;
          padding-right:20px;
          box-sizing: border-box;
          
            
            .goodsLs{
              display: flex;
              flex-wrap: wrap;
          justify-content: space-between;
              .item{
                border-radius: 6px;
                display: flex;
                align-items: center;
                background: #f7f7f7;
                width: 48%;
                height: 46px;
                margin-bottom: 16px;
                img{
                  width:30px;
                  height: 30px;
                }
                div{
                  width:80%;
                }
              }
            }
          
        }
      }
      .m13{
        width:100%;
        height: 200px;
        border-radius: 6px;
        overflow: hidden;
        img{
          width:100%;
          height: 100%;
        }
      }
      .m14{
        width:100%;
        height:120px;
        background: #fff;
        border-radius: 6px;
        display:flex;
        align-items: center;
        padding:0 20px;
        box-sizing: border-box;
        .logo{
          width: 80px;
          height: 80px;
          border-radius: 6px;
          overflow: hidden;
          margin-right: 20px;
          img{
            width:100%;
            height: 100%;
          }
        }
        .cont{
          width: 90%;
          overflow: hidden;
          padding-left: 20px;
          padding-right: 20px;
          box-sizing: border-box;
          .contbox{
            position: relative;
            padding: 0 30px;
            .mul{
              display: flex;
              width:100%;
              .mli{
                width: 80px;
                height: 90px;
                padding:5px 0;
                border-radius: 6px;
                // overflow: hidden;
                margin-right: 14px;
                img{
                  width:100%;
                  height: 100%;
                }
              }
            }
          }
        }
      }
      .m15{
        background: #fff;
        width: 100%;
        padding: 20px;
        .cont{
          margin-top:36px;
          width:100%;
          display: flex;
          flex-wrap: wrap;
          .item{
            margin-right: 20px;
            margin-bottom: 20px;
            height: 44px;
            line-height: 44px;
            background: #f7f7f7;
            padding:0 16px;
          }
        }
      }
    }
    .zckx{
        
        
        .ul-item{
            display: flex;
            height: 46px;
            .li-item{
                cursor: pointer;
                background: #f7f7f7;
                margin-right: 10px;
                width: 220px;
                height: 46px;
                padding: 0 20px;
                line-height: 46px;
                white-space: nowrap;
                overflow: hidden;
                text-overflow: ellipsis;
                border-radius: 6px;
                box-sizing: border-box;
            }
        }
    }
    .zytz{
        border-radius: 6px;
        border:1px solid #fbb8b4;
        height: 46px;
        box-sizing: border-box;
        display: flex;
        align-items: center;
        width:100%;
        img{
            width: 30px;
            height: 30px;
        }
        .ul-item{
          width: 100%;
            height: 46px;
            .li-item{
                cursor: pointer;
                // background: #f7f7f7;
                margin-right: 10px;
                width: 200px;
                height: 46px;
                padding: 0 10px;
                line-height: 72px;
                white-space: nowrap;
                overflow: hidden;
                text-overflow: ellipsis;
                border-radius: 6px;
                box-sizing: border-box;
            }
        }
    }

</style>